<!-- 
  卡片列表
 -->
<template>
  <ul class="alike-lis">
    <li v-for="(item, index) in dataList" :key="index">
      <div class="alike-lis-box">
        <div class="alike-lis-pic" @click="goCode(item)">
          <v-image :src="item.avatar ? item.avatar : require('@/assets/img/drone3.jpg')" alt="" />
        </div>
        <div class="alike-lis-word">
          <p class="alike-lis-title">
            <span>
              <span @click="goCode(item)">
                {{ item.name }}
              </span>
            </span>

            <el-popover placement="top" width="80" trigger="click" v-model="item.visible">
              <p>您确定要删除吗？</p>
              <div style="text-align: right; margin: 0">
                <el-button size="mini" type="text" @click="item.visible = false">取消</el-button>
                <el-button type="primary" size="mini" @click="del(item.id)">确定</el-button>
              </div>
              <i slot="reference" class="el-icon-delete delete-btn" />
            </el-popover>
          </p>

          <p class="alike-lis-hint">{{ item.desc }}</p>
          <p class="alike-lis-hint" v-if="verShow">版本数量：{{ item.version_index }}</p>

          <div class="alike-lis-user">
            <span class="user-name">创建人：{{ item.create_user.nick_name }}</span>
            <span class="date">{{ item.create_time }}</span>
          </div>
        </div>
      </div>
    </li>
  </ul>
</template>

<script>
export default {
  props: [
    "dataList", // 列表数据
    "goCode", // 跳转详情页方法
    "del",  // 删除方法
    "verShow" // 版本数量是否显示，非必填，默认值false
  ],
  data() {
    return {
    };
  },
  mounted() {
  },
  methods: {},
};
</script>

<style lang="less" scoped></style>
